<template>
  <div>
    <ht-dialog :title="title" center  :visible="open" @close="close">
      <ht-form
        ref="editForm"
        defaultEventKey="tenentInfo"
        :rowNum="1"
        :open="open"
        :rowData="editForm"
        :dictMap="dictMap"
        :formDiarules="rules"
        :formListOptions="formItemList"
        @isParentFn="isParentFn"
      />
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm"
          >{{ $t("common.confirm") }}
        </el-button>
        <el-button @click="close">{{ $t("common.cancel") }}</el-button>
      </div>
    </ht-dialog>
  </div>
</template>

<script>
import { dialogMixin } from "@/libs/dialogMixin";
import { isPhone } from "@/utils/validate";
import {
  apiUrlConfig,
  addMenu,
} from "@/api/authority_app/favouriteMenu/index.js";
import Vue from "vue";

export default {
  name: "EditTenant",
  mixins: [dialogMixin],
  data() {
    // 表单校验
    let checkTenantCodeUnique = (rule, value, callback) => {
      if (!value) {
        callback(
          new Error(
            `${this.lang("authority.tenantInfo.rules.tenantCodeEmpty")}`
          )
        );
      } else {
        checkTenantCode(this.editForm.id, this.editForm.tenantCode).then(
          (response) => {
            var result = response.result;
            if (!result) {
              callback(
                new Error(
                  `${this.lang("authority.tenantInfo.rules.tenantCodeExist")}`
                )
              );
            } else {
              callback();
            }
          }
        );
      }
    };
    let validPhone = (rule, value, callback) => {
      if (!value) {
        callback(
          new Error(`${this.lang("authority.tenantInfo.rules.phoneEmpty")}`)
        );
      } else if (!isPhone(value)) {
        callback(
          new Error(`${this.lang("authority.tenantInfo.rules.phoneIncorrect")}`)
        );
      } else {
        callback();
      }
    };
    return {
      id: "",
      disabled: false,
      // 表单校验
      rules: {
        menuId: [
          {
            required: true,
            trigger: "change",
            message: this.$t("common.pleaseSelect"),
          },
        ],
      },
      formItemList: [
        {
          type: "selectWithButton",
          prop: "menuId",
          selectOptionList: [],
          defaultAttr: {
            label: this.$t("authority.favouriteMenu.form.menu"),
            placeholder: this.$t("common.pleaseSelect"),
          },
          selectFormat: {
            labelFormatter: (item, form) => {
              return `${item.value} - ${item.label}`;
            },
          },
          optionFormat: {
            allowSearch: true,
            needToFormatWithNoData: true,
            hasButton: true,
            resultMode: "result",
            optionsValue: "id",
            optionsLabel: "menuName",
            queryUrl: apiUrlConfig.searchMenu,
            searchParam: {},
          },
        },
      ],
    };
  },
  mounted() {
    this.loadDicts(["busiScope"]);
  },
  methods: {
    show(id = "", disabled = false) {
      this.id = id;
      this.disabled = disabled;
      this.$set(this, "editForm", {});
      if (id) {
        this.title = this.lang("common.edit");
      } else {
        this.title = this.lang("common.add");
        this.open = true;
      }
    },
    // 取消按钮
    close(state = false) {
      this.open = false;
      // this.reset();
      this.$emit("editComplete", state);
    },
    /** 提交按钮 */
    isParentFn(formData) {
      addMenu(formData.menuId).then((res) => {
        this.msgSuccess(`${this.lang("common.operateSuccess")}`);
        this.close(true);
      });
      // }
      // });
    },
    /** 提交按钮 */
    submitForm: function () {
      this.$refs.editForm.sonData();
    },
  },
};
</script>
